<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>kafka_log</title>
</head>
<script src="./jquery-3.4.1.min.js"></script>
<body>
<input id="user_id" type="text" value="user" hidden="hidden">
<input id="job_code" type="text" value="code" hidden="hidden">
<button id="click" class="action" act_type="select">查询</button>
<button id="collect" class="action" act_type="insert">插入</button>
<button id="send" class="action" act_type="update">修改</button>
<button id="upload" class="action" act_type="delete">删除</button>
<label id="label"></label>
</body>
<style>
    .action {
        height: 30px;
        font-family: 微软雅黑;
        font-size: 14px;
        color: aliceblue;
        border: none;
        border-radius: 4px;
    }

    #click {
        background-color: cadetblue;
    }

    #collect {
        background-color: cornflowerblue;
    }

    #send {
        background-color: coral;
    }

    #upload {
        background-color: indianred;
    }
</style>
<script>
  $(document).ready(function () {
    $(".action").click(function () {
      var user_id = $("#user_id").val() + formatNewDate();
      var act_time = new Date();
      var action = this.getAttribute("act_type")
      var job_code = $("#job_code").val() + formatNewDate();
      var log = user_id + "\t" + act_time + "\t" + action + "\t" + job_code;
      $.ajax({
        url: "http://192.168.56.138:80/log",
        type: "POST",
        dataType: "json",
        data: log
      })
    });
  })

  function add0(m) {
    return m < 10 ? '0' + m : m
  }

  function formatNewDate() {
    //shijianchuo是整数，否则要parseInt转换
    var time = new Date();
    var y = time.getFullYear();
    var m = time.getMonth() + 1;
    var d = time.getDate();
    var h = time.getHours();
    var mm = time.getMinutes();
    var s = time.getSeconds();
    return y + '-' + add0(m) + '_' + add0(d) + '_' + add0(h) + '_' + add0(mm) + '_' + add0(s);
  }
</script>
</html>
